import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import '../../../../common/app_colors.dart';
import 'line_chart2_logic.dart';
import '../../../../common/app_text_style.dart';
import '../../../../widget/text/text_widget.dart';

class LineChart2Page extends StatefulWidget {
  const LineChart2Page({Key? key}) : super(key: key);

  @override
  State<LineChart2Page> createState() => LineChart2PageState();
}

class LineChart2PageState extends State<LineChart2Page> {
  final logic = Get.put(LineChart2Logic());
  final state = Get.find<LineChart2Logic>().state;

  @override
  Widget build(BuildContext context) {
    return Container(
      margin: const EdgeInsets.only(
        left: 32,
        right: 32,
        top: 32,
        bottom: 32,
      ),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          TextWidget(
            "Line Chart Sample2",
            TS_FF50E4FF_18_W4,
          ),
          const SizedBox(height: 20),
          Container(
            decoration: const BoxDecoration(
              color: AppColors.colorFF1B2339,
              borderRadius: BorderRadius.all(Radius.circular(8)),
            ),
            child: Stack(
              children: <Widget>[
                AspectRatio(
                  aspectRatio: 1.70,
                  child: Padding(
                    padding: const EdgeInsets.only(
                      right: 18,
                      left: 12,
                      top: 24,
                      bottom: 12,
                    ),
                    child: LineChart(
                     state.showAvg ? state.avgData() : state.mainData(),
                    ),
                  ),
                ),
                SizedBox(
                  width: 60,
                  height: 34,
                  child: TextButton(
                    onPressed: () {
                      setState(() {
                        state.showAvg = !state.showAvg;
                      });
                    },
                    child: Text(
                      'avg',
                      style: TextStyle(
                        fontSize: 12,
                        color: state.showAvg ? Colors.white.withOpacity(0.5) : Colors.white,
                      ),
                    ),
                  ),
                ),
              ],
            ),
          )
        ],
      ),
    );
  }
}
